import { useState, useEffect } from "react";
import appicon from "@/assets/images/appicon.png";
import { Image } from 'antd';
import { GetAppName } from "@go/main/App";
import styles from "./styles.module.less";

const TitleBar = () => {
  const [appName, setAppName] = useState("");

  useEffect(() => {
    async function getAppName() {
      const name = await GetAppName();
      setAppName(name);
    }
    getAppName();
  }, []);

  return (
    <div className={styles.titleBar} style={{
      "--wails-draggable": "drag",
    }}>
      <div className={styles.appName}>
        <Image width={20} preview={false} src={appicon} />
        <span
          style={{
            "--wails-draggable": "no-drag",
          }}
        >
          {appName}
        </span>
      </div>
    </div>
  )
}

export default TitleBar